- <table>
- Table: this is what makes the
table. It must begin and end with this.
It can include the following:
- border:
defines the width of the border
surrounding the table.
cellpadding: this will be a value
of 1 to whatever. This is the space
between the cell and it's contents.
cellspacing: this is the space
between each individual cell. Again can
be anything from 1 to whatever.
width: defines the width, in
pixels, of the particualer frame.
align: defines how the table will
be displayed. Can include left, center,
or right.
border: defines the width, in pixels, of
the table itself.
- Example
<table align=center border=1
width=580 cellpadding=5
cellspacing=5></table>
-
- Now for rows
and data that defines the table.
- <tr>
- Table Row
- This is
required because it tells the browser
where a new row begins. It can have the
folowing options:
align: adjusts the text or
graphics in the row. It has the
attributes left, center (or middle), and
right.
valign: which stands for verticle
align. This controls from top to bottom.
It can include top, middle, bottom, and
baseline. The row is then followed by...
bgcolor: defines the background
color for the cell. Can be hexidecimal or
RGB code.
bordercolor: defines the border
color of the cell.
- Example
<tr align=middle valign=top
bgcolor=#000000
bordercolor=#000080></tr>
-
- <td>
- Table Data
- This is what
defines the cell itself. It can include
the tags from <tr>, but can also
include:
align: aligns text or graphics
horizontally. Can be left, middle, or
right.
valign: aligns text or graphics
vertically. Can be left, middle, or
right.
width: defines the width of the
cell by pixels or percentage.
height: defines the height of the
cell.
bgcolor: defines the background
color for the cell in Hexidecimal or RGB.
background: tiles an image as the
background much like <body
background ...> does in the body tag.
bordercolor: defines the color of
the border of the cell. It only works on
the table has a border of 1 or more.
rowspan: defines how many rows the
cell will span as compared to other rows.
colspan: defines how many columns
the cell will span as compared to other
rows.
nowrap: allows the text to
continue uninhibited from the table
cells.
- Example
<td width=300 height=300
rowspan=2 colspan=2 bgcolor=#000000
bordercolor=#000080
background="file.gif"
nowrap></td>
-
- <th>
- Table Data
- Just like
<td>, but it allows everything
to be centered within the cell.
- Example
<th width=300 height=300
rowspan=2 colspan=2 bgcolor=#000000
bordercolor=#000080
background="file.gif"
nowrap></th>
-
- <caption>
- The Caption
- This allows
the table to have a caption. Duh!
- Example
<table width=300 cellpadding=5 cellspacing=5
border=5 align=middle>
<tr> <td colspan=3 align=middle
valign=middle> THIS RULES!!!
</td> </tr>
<tr> <td align=middle valign=middle>
Number 1
</td>
<td align=middle valign=middle>
Number 2
</td>
<td align=middle valign=middle>
Number 3
</td> </tr>
<tr> <td colspan=3 align=middle valign=middle>
THAT'S IT!!!
</td> </tr> </table>
Now compare it to this output:
THIS
RULES!!! |
Number 1 |
Number 2 |
Number 3 |
THAT'S
IT!!! |
For some thorough examples
of their possible usages, check out my
Examples page. It has a tone of different
examples to choose from.
Hopefully,
this has answered some of your questions
regarding tables. There's not very much
to them, but they can be a pain in the
butt sometimes. But just keep werking at
it, and you'll get it. If I can do it,
then anyone can.
Return Home
- 1997 Copyright Kattmann
Publishing
|
|